<template>
	<div>
		<!-- <mealInfoDetail :mealInfo="mealInfos"></mealInfoDetail> -->
		<el-table :data="shortOrderList" height="700" border style="width: 100%;">
			<el-table-column prop="shortid" label="订单id" width="150">
			</el-table-column>
			<el-table-column prop="longstate" label="订单状态" width="150">
			</el-table-column>
			<el-table-column prop="shortcreatetime" label="订单时间" width="150">
			</el-table-column>
			<el-table-column prop="shortprice" label="套餐价格">
			</el-table-column>
			<el-table-column label="操作" width="250" fixed="right">
				<template slot-scope="scope">
					<el-button @click="handleClick(scope.row)" type="text" size="small" icon="el-icon-document">详情</el-button>
					<!-- <el-button @click="handleClick(scope.row)" type="text" size="small">删除</el-button> -->
				</template>
			</el-table-column>
		</el-table>
		<shortOrderInfoDetail :shortOrder="shortOrder" :staffList="staffList"></shortOrderInfoDetail>
	</div>
</template>
<script>
	// import mealInfoDetail from '@/components/major_meal_info/Major_meal_info_detail.vue'
	import shortOrderInfoDetail from '@/components/short_order_info/short_order_info_detail.vue'
	import {
		request
	} from "network/request.js"

	export default {
		props: {
			shortOrderList: {}
			// [
			// 	 {
			// 	    "longremark": "string",
			// 	    "longremark2": "string",
			// 	    "longstate": "string",
			// 	    "mealid": 0,
			// 	    "shortcreatetime": "2019-10-13T10:38:29.844Z",
			// 	    "shortdetail": "string",
			// 	    "shortid": 0,
			// 	    "shortprice": 0,
			// 	    "u2id": 0,
			// 	    "uid": 0
			// 	  }
			// ]
		},
		components: {
			shortOrderInfoDetail
		},
		data() {
			return {
				shortOrder: {
					"longremark": "string",
					"longremark2": "string",
					"longstate": "string",
					"mealid": 0,
					"shortcreatetime": "2019-10-13T10:38:29.844Z",
					"shortdetail": "string",
					"shortid": 0,
					"shortprice": 0,
					"u2id": 0,
					"uid": 0
				},
				staffList: []
			}
		},
		methods: {
			handleClick(row) {
				request({
					url: '/Order/shortOrderId',
					method: 'get',
					params: {
						// id:this.$store.state.mealid
						id: row.shortid
					}
				}).then(res => {
					this.shortOrder = res.data
					return request({
						url: '/User2/userInfo2u2id',
						method: 'get',
						params: {
							// id:this.$store.state.mealid
							u2id: res.data.u2id
						}
					})
				}).then(res => {
					this.shortOrder.u2id = res.data
					return request({
						url: '/Meal/Meal',
						method: 'get',
						params: {
							// id:this.$store.state.mealid
							id: row.mealid
						}
					})
				}).then(res => {
					this.shortOrder.mealid = res.data
					return request({
						url: '/User/UserInfo',
						method: 'get',
						params: {
							// id:this.$store.state.mealid
							uid: row.uid
						}
					})
				}).then(res => {
					this.shortOrder.uid = res.data
					this.$store.commit("updateOrderInfoflag", true)
				})
				if (row.longstate != "未服务") {
					this.staffList=[]
					request({
						url: '/OrderEmp/ShortinfoBYshortId',
						method: 'get',
						params: {
							// id:this.$store.state.mealid
							shortId: row.shortid
						}
					}).then(res => {
						
						return 	request({
						url: '/Emp/empInfo',
						method: 'get',
						params: {
							// id:this.$store.state.mealid
							empid: res.data.empid
						}
					})
					}).then(res=>{
						this.staffList.push(res.data)
					})
					

				} else {
					request({
						url: '/Emp/empInfos',
						method: 'get'
					}).then(res => {
						this.staffList = []
						res.data.forEach(e => {
							if (e.emptype == 'B' && e.empstate == '2') {
								this.staffList.push(e)
							}
						})
					})
				}



			}

		}
	}
</script>
<style>
	el-table-column {
		height: 50px;
	}

	.el-main {
		line-height: 20px;
	}
</style>
